<wicket:extend>
	<div class="pull-request-detail card m-2 m-sm-5">
		<div wicket:id="requestHeader" class="card-header align-items-center justify-content-start flex-nowrap">
			<div class="d-flex align-items-center flex-grow-1">
				<wicket:enclosure child="title">
				<div class="card-title mr-3"><span wicket:id="title"></span></div>
				</wicket:enclosure>
				<a wicket:id="edit" title="Edit title" class="btn btn-xs btn-icon btn-light btn-hover-primary edit mr-3"><wicket:svg href="edit" class="icon"></wicket:svg></a>
				<form wicket:id="editForm" class="form flex-grow-1 d-flex align-items-center">
					<div class="clearable-wrapper mr-3 flex-grow-1">
						<input wicket:id="title" type="text" placeholder="Input title" class="form-control">
					</div>
					<div class="flex-shrink-0 text-nowrap">
						<button wicket:id="save" title="Save" value="Save" class="btn btn-primary btn-icon mr-1" type="submit"><wicket:svg href="tick" class="icon"></wicket:svg></button>
						<a wicket:id="cancel" title="Cancel" type="button" value="Cancel" class="btn btn-secondary btn-icon"><wicket:svg href="times" class="icon"></wicket:svg></a>
					</div>
				</form>
			</div>
			<a wicket:id="moreInfo" class="side-info flex-shrink-0 ml-3" title="More info"><wicket:svg href="ellipsis" class="icon"></wicket:svg></a>
		</div>
		<div class="card-body d-flex">
			<div class="main flex-grow-1">
				<div wicket:id="statusBar" class="status-bar d-flex mb-4">
					<div wicket:id="status" class="badge status mr-3"></div>
					<a wicket:id="clone" title="Check out to local workspace" class="btn btn-light btn-hover-primary btn-icon mr-3"><wicket:svg href="download2" class="icon"></wicket:svg></a>
					<a wicket:id="newPullRequest" class="btn btn-primary btn-icon flex-shrink-0 ml-auto" title="Open new pull request"><wicket:svg href="plus" class="icon"/></a>
				</div>
				<div wicket:id="requestSummary" class="summary mb-4 font-size-h6">
					<wicket:enclosure>
	                <div class="text-warning">
	                	<wicket:svg href="exclamation-circle" class="icon"></wicket:svg>  <span wicket:id="checkError"></span>
	                </div>
					</wicket:enclosure>
					<div wicket:id="discarded" class="discarded text-gray">
						<wicket:svg href="info-circle" class="icon"></wicket:svg> This pull request has been discarded
					</div>
					<div wicket:id="fastForwarded" class="fast-forwarded text-success">
						<wicket:svg href="tick-circle" class="icon"></wicket:svg> Target branch was fast-forwarded to source branch
					</div>
					<div wicket:id="merged" class="merged text-success">
						<wicket:svg href="tick-circle" class="icon"></wicket:svg> Commits were merged into target branch
					</div>
					<div wicket:id="mergedOutside" class="merged-outside text-success">
						<wicket:svg href="tick-circle" class="icon"></wicket:svg> Commits were merged into target branch outside of this pull request
					</div>
					<div wicket:id="squashed" class="squashed text-success">
						<wicket:svg href="tick-circle" class="icon"></wicket:svg> Commits were squashed into a single commit on target branch
					</div>
					<div wicket:id="rebased" class="rebased text-success">
						<wicket:svg href="tick-circle" class="icon"></wicket:svg> Commits were rebased onto target branch
					</div>
					<div wicket:id="calculatingMergePreview" class="calculating-merge-preview text-warning d-flex align-items-center">
						<wicket:svg href="loading" class="icon spin mr-2"></wicket:svg> Calculating merge preview...
					</div>
					<div wicket:id="calculatedMergePreview" class="calculated-merge-preview text-success">
						<wicket:svg href="tick-circle" class="icon"></wicket:svg> Able to merge without conflicts
					</div>
					<div wicket:id="hasMergeConflict" class="has-merge-conflict text-warning">
						<wicket:svg href="exclamation-circle" class="icon"></wicket:svg> There are merge conflicts. 
						<wicket:enclosure child="resolveInstructions">
							Please follow <a wicket:id="resolveInstructions" class="link-primary" href="javascript:void(0);">this instruction</a> to resolve the conflicts
						</wicket:enclosure>
					</div>
					<div wicket:id="noValidCommitSignature" class="no-valid-commit-signature text-warning">
						<wicket:svg href="times-circle" class="icon"></wicket:svg> Pull request can not be merged now as valid signature is required for head commit   
					</div>
					<div wicket:id="requestedForChanges" class="requested-for-changes text-warning">
						<wicket:svg href="diff" class="icon"></wicket:svg> Pull request can not be merged now as it was <a class="more-info d-inline link-primary">requested for changes</a> 
					</div>
					<div wicket:id="waitingForReviews" class="waiting-for-reviews text-warning">
						<wicket:svg href="clock" class="icon"></wicket:svg> Pull request can not be merged now as it is <a class="more-info d-inline link-primary">pending review</a>
					</div>
					<div wicket:id="unsuccessfulBuilds" class="unsuccessful-builds text-warning">
						<wicket:svg href="times-circle" class="icon"></wicket:svg> Pull request can not be merged now as <a class="more-info d-inline link-primary">some required builds</a> are not successful
					</div>
					<div wicket:id="unfinishedBuilds" class="unfinished-builds text-warning">
						<wicket:svg href="clock" class="icon"></wicket:svg> Pull request can not be merged now as <a class="more-info d-inline link-primary">some required builds</a> are not finished yet
					</div>
					<wicket:enclosure child="commitMessageCheckError">
					<div class="invalid-commit-messages text-warning">
						<wicket:svg href="times-circle" class="icon"></wicket:svg> <span wicket:id="commitMessageCheckError"></span>
					</div>
					</wicket:enclosure>
					<wicket:enclosure child="requiredJobs">
					<div class="required-jobs text-warning">
						<wicket:svg href="warning" class="icon"></wicket:svg> 
						<span wicket:id="requiredJobsMessage"></span> 
						<span wicket:id="requiredJobs" class="d-inline-block mr-2">
							<span wicket:id="jobName"></span>
							<a wicket:id="runJob" title="Run this job"><wicket:svg href="play" class="icon"></wicket:svg></a>
						</span>
					</div>
					</wicket:enclosure>
					<div wicket:id="mergeableByCodeWriters" class="mergeable-by-code-writers text-info">
						<wicket:svg href="info-circle" class="icon"></wicket:svg> Pull request can only be merged by users with code write permission
					</div>
					<div wicket:id="contributions" class="contribution">
						<div wicket:id="head" class="head font-weight-bold mb-2 "></div>
						<div wicket:id="body" class="body"></div>
					</div>
				</div>
				<div wicket:id="requestOperations" class="operations">
					<a wicket:id="merge" class="btn btn-sm btn-outline-success">Merge</a>
					<a wicket:id="discard" class="btn btn-sm btn-outline-danger">Discard</a>
					<a wicket:id="approve" class="btn btn-sm btn-outline-primary">Approve</a>
					<a wicket:id="requestForChanges" class="btn btn-sm btn-outline-primary">Request For Changes</a>
					<a wicket:id="reopen" class="btn btn-sm btn-outline-primary">Reopen</a>
					<a wicket:id="deleteSourceBranch" class="btn btn-sm btn-outline-primary">Delete Source Branch</a>
					<a wicket:id="restoreSourceBranch" class="btn btn-sm btn-outline-primary">Restore Source Branch</a>
				</div>
				<ul wicket:id="requestTabs" class="tabs nav nav-tabs nav-tabs-line nav-bold mb-5 mt-3 align-items-center"></ul>
				<wicket:child></wicket:child>
			</div>
			<div wicket:id="moreInfo" class="more-info"></div>
		</div>
	</div>
	<wicket:fragment wicket:id="codeCommentsTabLinkFrag">
		<a wicket:id="link" class="code-comments nav-link d-flex align-items-center">Code Comments <wicket:svg href="dot" class="icon ml-2 d-none"></wicket:svg></a>
	</wicket:fragment>
	<wicket:fragment wicket:id="moreInfoFrag">
		<div class="submission">
			<table class="table table-borderless">
				<tr>
					<td class="name">Submitter</td>
					<td class="value text-break text-right"><span wicket:id="submitter"></span></td>
				</tr>
				<tr>
					<td class="name">Target</td>
					<td class="value text-break text-right">
						<a wicket:id="changeTargetBranch" class="btn btn-xs btn-icon btn-light btn-hover-primary" title="Change"><wicket:svg href="arrow" class="rotate-90 icon"/></a>
						<a wicket:id="targetBranch"></a>
					</td>
				</tr>
				<tr>
					<td class="name">Source</td>
					<td class="value text-right text-break"><a wicket:id="sourceBranch"></a></td>
				</tr>
			</table>
		</div>
		<wicket:enclosure child="reviews">
		<div class="reviews">
			<div class="head">Reviewers</div>
			<div wicket:id="reviews" class="body"></div>
			<div wicket:id="reviewerHelp" class="font-size-sm text-muted form-text">Pull request can only be merged after getting approvals from all reviewers</div>
		</div>
		</wicket:enclosure>
		<wicket:enclosure child="jobs">
		<div class="jobs">
			<div class="head">
				Jobs 
				<span wicket:id="hiddenJobsNote" class="warning ml-2" title="Some jobs are hidden due to permission policy">
					<wicket:svg href="exclamation-circle-o" class="icon"/>
				</span>
			</div> 
			<div wicket:id="jobs" class="body"></div>
			<div wicket:id="jobsHelp" class="font-size-sm text-muted form-text">Jobs marked with <span class="text-danger">*</span> are required to be successful</div>
		</div>
		</wicket:enclosure>
		<wicket:enclosure child="assignments">
		<div class="assignments">
			<div class="head">Assignees</div>
			<div wicket:id="assignments" class="body"></div>
			<div wicket:id="assigneeHelp" class="font-size-sm text-muted form-text">Assignees are expected to merge the pull request</div>
		</div>
		</wicket:enclosure>
		<div wicket:id="mergeStrategy" class="merge-strategy">
			<div class="head">Merge Strategy</div>
			<div class="body">
				<select wicket:id="editor" class="form-control custom-select"></select> 
				<span wicket:id="viewer"></span>
				<div wicket:id="help" class="font-size-sm text-muted form-text"></div>
			</div>
		</div>
        <div wicket:id="labels" class="labels">
			<div wicket:id="head" class="d-flex align-items-center justify-content-between mb-3">
		        <span class="font-weight-bolder">Labels</span>
				<wicket:svg href="gear" class="icon icon-sm"></wicket:svg>
			</div>
	        <div wicket:id="body" class="body d-flex align-items-center"></div>
			<span wicket:id="labelsHelp" class="form-text font-size-sm text-muted"><wicket:svg href="bulb" class="icon icon-sm"/> Labels can be defined in Administration / Label Management</span>
        </div>
		<div wicket:id="watches" class="watches"></div>
		<div wicket:id="reference"></div>
		<div wicket:id="actions" class="d-flex align-items-center justify-content-between">
			<wicket:enclosure child="synchronize">
			<div class="synchronize d-flex align-items-center mr-3">
				<a wicket:id="synchronize" class="btn btn-light-primary mr-2">Synchronize</a>
				<a href="javascript:void(0)" class="help text-muted text-hover-primary" title="In case the pull request status is out of sync with underlying repository, you may synchronize them manually here">
					<wicket:svg href="question-o" class="icon"/>
				</a>
			</div>
			</wicket:enclosure>
			<a wicket:id="delete" class="delete btn btn-light-danger">Delete</a>
		</div>
    </wicket:fragment>
	<wicket:fragment wicket:id="projectTitleFrag">
		<span class="d-flex align-items-center">
			<a wicket:id="pullRequests" class="text-nowrap">Pull Requests</a> 
			<span class="dot"></span>
			<span wicket:id="pullRequestNumber"></span>
		</span>
	</wicket:fragment>
	<wicket:fragment wicket:id="cloneFrag">
		<div class="p-4">
			<div class="font-weight-bolder font-size-lg mb-2">Checkout Pull Request Head</div>
			<div class="code font-size-sm">  
				<div>git fetch origin <span wicket:id="headRef"></span></div>
				<div>git checkout FETCH_HEAD</div>
			</div>
			<wicket:enclosure child="mergeRef">
			<div class="font-weight-bolder font-size-lg mt-4 mb-2">Checkout Pull Request Merge Preview</div>
			<div class="code font-size-sm">  
				<div>git fetch origin <span wicket:id="mergeRef"></span></div>
				<div>git checkout FETCH_HEAD</div>
			</div>
			</wicket:enclosure>
		</div>
	</wicket:fragment>
</wicket:extend>
